﻿@{
    ViewBag.Title = "FormValidation";
    Layout = null;
}

<div ng-controller="FormValidationCtrl as ctrl" ng-strict-di>
    <br/>
    <br/>
    <div class="row">
        <div class="col-lg-12">
            <form name="frm">
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>Email address: <strong ng-bind="ctrl.Email"></strong></label>
                            <input type="email"
                                   name="mail"
                                   ng-model="ctrl.Email"
                                   ng-model-options="{debounce: 500, updateOn: 'blur'}"
                                   required class="form-control"
                                   placeholder="Enter email">
                        </div>
                    </div>

                </div>

                <div class="row">
                    <div class="col-md-12">
                        <ng-messages for="frm.mail.$error" ng-if="ctrl.submitted">
                            <div ng-message="required">
                                Bitte eine Eingabe festlegen
                            </div>
                            <div ng-message="email">
                                Bitte eine gültige Email eingeben
                            </div>
                        </ng-messages>
                    </div>
                </div>


                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label>Age: <strong ng-bind="ctrl.Age"></strong></label>
                            <input type="number"
                                   ng-model="ctrl.Age"
                                   ng-model-options="{updateOn: 'blur'}"
                                   name="age"
                                   required class="form-control">
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-12">
                        <ng-messages for="frm.age.$error">
                            <div ng-message="required">
                                Bitte eine Eingabe festlegen
                            </div>
                            <div ng-message="number">
                                Bitte eine gültige Zahl eingeben
                            </div>
                        </ng-messages>
                    </div>
                </div>


                <div class="row">
                    <div class="col-md-12">
                        <a href="" class="btn btn-default" ng-click="ctrl.submitForm()">Absenden</a>

                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
